	<!--  D:/project/app/ydz-app-uniapp/static/images/knowledge/clinicaldetail -->
<template>
	<view class="pagebody">
		<view class="bgfff">
			<view class="topbox">
				<NavHeader></NavHeader>
			</view>
		</view>
		<view class="topcontent  bgfff color303b39 ">
			<view class="justify-start flex-row mb16">
				<view class="left_icon"><image src></image></view>
				<view class="lineclamp2" style="margin-left: 8rpx;">{{disease.name}}赠药活动</view>
			</view>
			<view class="listbox" v-for="(item,index) in newsList" :key="index" >
				<view class="newscard">
					<view class="title lineclamp2" @click="toNews(item.id)">
						{{item.name}}
					</view>
					<view class="content lineclamp2" >
						{{item.nostyletext?item.nostyletext.slice(0,40)+"...":''}} <span @click="toNews(item.id)" style="font-weight:400;font-size:32rpx;color:#1f3d76;line-height:32px;">[详情]</span>
					</view>
					<view class="flex-row justify-between align-center " style="margin: 32rpx 0;">
						<view class="" style="color: #7E8987; font-size: 24rpx;">
							推荐指数：{{item.hits}}
						</view>
						<view class="" style="color: #7E8987; font-size: 24rpx;">
							{{item.createTime}}
						</view>
					</view>
				</view>
			</view>
		</view> 
		<view class="pagebox">
			<!-- 统一分页器 -->
			<view class="thepager justify-between align-center">
				<view @click="tonewpage(1)" class="pagebtn" :class="page!=1?'havepage':''">
					上一页
				</view>
				<view class="pageNm">
					<span class="nowpage">{{page}}</span> <span style="margin: 0 8rpx;">/</span>{{pages}}
				</view>
				<view @click="tonewpage(2)" class="pagebtn" :class="page<pages?'havepage':''">
					下一页
				</view>
			</view>
		</view>
		<community style="margin-top: 26rpx;"></community>
		
		<typenews :type="2" :disname="userDocument.diseaseName" :disid="userDocument.diseaseId" :list="znNewsList">
		</typenews>
		<consulting></consulting>
		<typenews :type="1" :disname="userDocument.diseaseName" :disid="userDocument.diseaseId" :list="zsNewsList">
		</typenews>
		<aboutdrug :drugList="drugList"></aboutdrug>
		<aboutclinical :clinicalList="clinicalList"></aboutclinical>
		<HotnewsCom></HotnewsCom>
		<FixedFoot :typeid="2"></FixedFoot>
	</view>
</template>

<script>
	import FixedFoot from '../../layouts/fixedfoot.vue';
	import NavHeader from '../../layouts/navheader.vue';
	import NewslistCom from '../../components/generalcom/newslistcom.vue';
	import AdvCom from '../../layouts/advcome.vue';
	import community from '../../components/generalcom/community.vue'
	import consulting from '../../components/generalcom/consulting.vue'
	import aboutdrug from '../../components/generalcom/aboutdrug.vue'
	import aboutclinical from '../../components/generalcom/aboutclinical.vue'
	import HotnewsCom from '../../components/generalcom/hotnewcom.vue';
	import typenews from '../../components/generalcom/typenews.vue';
	import {
		getInfo
	} from '@/api/login'
	import {
			getDiseaseById,getNewsList
		} from '@/api/api.js'
	export default {
		components: {
			FixedFoot,
			NavHeader,
			NewslistCom,
			AdvCom,
			community,
			consulting,
			aboutdrug,
			aboutclinical,
			HotnewsCom,
			typenews
		
		},
		data() {
			return {
				page:1,
				pageSize:6,
				total:0,
				pages:0,
				disease:{},
				title:'',
				newsList:[],
				diseaseList:[]
			}
		},
		onLoad(option) {
			this.getuser()
			this.getDiseaseById(option.id)
		},
		methods: {
			getuser() {
				getInfo().then(res => {
					this.user = res.user
					this.userDocument = res.userDocument
					let dis = {
						"diseaseId": res.userDocument.diseaseId
					}
					this.diseaseList.push(dis);
					this.getDrugList()
					this.selectClinicalList(this.diseaseList)
					this.zsSelectNewsList()
					this.znSelectNewsList()
				})
			},
			changepage(e) {
				this.page = e.current
				this.getNewsList();
				this.topPage();
			},
			topPage(){
			 	uni.pageScrollTo({
				scrollTop:0,   // 滚动到页面的目标位置  这个是滚动到顶部, 0 
				duration:30  // 滚动动画的时长
				})
			},
			getDiseaseById(id){
				console.log("-------id--------",id)
				getDiseaseById(id).then(res => {
					if(200 == res.code){
						this.disease = res.data
						let dis = {
							"diseaseId":this.disease.id
						}
						this.diseaseList.push(dis);
						this.getNewsList();
						
					}
				})
			},
			// 统一分页器事件
			tonewpage(num) {
				if (num == 1) {
					if (this.page != 1) {
						this.page--
						this.getNewsList();
						this.topPage();
					} else {
						return
					}
				} else {
					if (this.page < this.pages) {
						this.page++
						this.getNewsList();
						this.topPage();
					} else {
						return
					}
				}
			},
		
			getNewsList() {
			   let param = {
					"pageNum": this.page,
					"pageSize": this.pageSize,
					"orderByColumn" : "create_time",
					"isAsc":"desc",
					"state":"1",
					"type":"2",
					"diseaseId":this.disease.id,
			    }
				//相关文章
				getNewsList(param).then(response => {
					this.newsList = response.rows
					this.total = response.total
					this.pages = Math.ceil(this.total / this.pageSize)
					this.newsList.forEach(item=>{
						let str = item.content
						if (str) {
						  let words = str.replace(/<[^<>]+>/g, "").replace(/&nbsp;/gi, "")
						  str = words.replace(/\s/g, "")
						  item.nostyletext = str
						}
					})
					
				})
			},
			toNews(id) {
				uni.navigateTo({
					url: '/pages/knowledge/drugnews?id='+id,
				});
			}
		}
	}
</script>

<style lang="scss" scoped>
	.pagebody {
		padding-bottom: 136rpx;
		background: #F0F6F5;

		.topbox {
			padding: 20rpx 24rpx;
			background: linear-gradient(180deg, rgba(0, 217, 178, 0.25) 0%, rgba(0, 217, 178, 0) 100%);
		}
		.topcontent{
			padding: 42rpx 24rpx 24rpx;
			border-radius: 0;
			font-family: PingFang SC, PingFang SC;
			font-weight: 800;
			font-size: 36rpx;
			line-height: 38rpx;
			.left_icon{
				width: 8rpx;
				height: 40rpx;
				background: #00D9B2;
				border-radius: 50px 50px 50px 50px;
				line-height:  40rpx;
			}
			.listbox {
				padding: 0 24rpx 24rpx;
			
				.newscard:nth-last-child(1) {
					border-bottom: none;
				}
			
				.newscard {
					border-bottom: 1rpx dashed #D7DDDC;
					margin-top: 24rpx;
			
					.title {
						font-size: 38rpx;
						color: #303B39;
						line-height: 72rpx;
						text-align: left;
					}
			
					.content {
						font-weight: 500;
						font-size: 32rpx;
						color: #576260;
						line-height: 56rpx;
					}
				}
			
			}
		}
		.pagebox {
			background: #fff;
			padding: 32rpx 24rpx;
			border-radius: 0 0 32rpx 32rpx;
		
			// 统一分页器样式
			.thepager {
				.pagebtn {
					width: 178rpx;
					height: 76rpx;
					border: 1px solid #B8C3C1;
					text-align: center;
					line-height: 76rpx;
					font-weight: 400;
					font-size: 32rpx;
					color: #303B39;
					background: #fff;
					border-radius: 24rpx;
				}
		
				.havepage {
					color: #00D9B2 !important;
					border-color: #00D9B2 !important;
				}
		
				.pageNm {
					font-weight: 400;
					font-size: 32rpx;
					color: #7E8987;
		
					.nowpage {
						color: #303B39;
		
					}
				}
		
			}
		}
	}
</style>
